<!--
  Generated template for the ReactiveListLabelPage page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<ion-header>

  <ion-navbar>
    <ion-title>Reactive List Label</ion-title>
  </ion-navbar>

</ion-header>


<ion-content #content>
  <ion-fab class="fab-reactive-list" top center>
    <button ion-fab> {{ currentCategory }} </button>
  </ion-fab>
  <ion-card is-visible [content]="content" (visible)="itemIsVisible($event, book)" *ngFor="let book of dataList">
    <img [src]="book.pictureProduct" />
    <ion-card-content>
      <ion-card-title>
        {{ book.productName }}
      </ion-card-title>
      <p> {{ book.author }} </p>
      <b> {{ book.category }} - {{ book.price | currency:'USD' }}</b>
    </ion-card-content>
  </ion-card>
</ion-content>
